<template>
  <div class="wrapper" ref="wrapper">
    <div class="dd content">
      <people></people>
      <div class="img_parent">
  			<img src="http://file.zoomyoung.cn/web/img/001.jpg" class="background"/>
  			<img src="http://file.zoomyoung.cn/web/img/002.jpg" class="background"/>
  			<img src="http://file.zoomyoung.cn/web/img/003.jpg" class="background"/>
  			<img src="http://file.zoomyoung.cn/web/img/004.jpg" class="background"/>
  			<img src="http://file.zoomyoung.cn/web/img/005.jpg" class="background"/>
  		</div>
     </div>
     <div class="click_btn">
          <div class="nav_buy">
             <span class="nav_buy_zi"><img :src="buyImg"  v-on:click="buy" /></span>
             <span class="nav_buy_time">{{timer}}</span>
          </div>
      </div>
   </div>
</template>
<script>
import people from './compon/peopleShow.vue'
import Bscroll from 'better-scroll'
export default {
  name: 'show1',
  data () {
    return {
      buyImg:"",
      timer:'dsa',
      price:{},
      is_action:''
      }
   },
  components:{
  	people
     },
     methods:{
      buy(){
        this.$router.push({name:"information",query:{code:this.$route.query.code}}); 
      },
      timeFormate(total){
      var hour = parseInt(total  / 60 / 60 % 24) < 10 ?'0' + parseInt(total  / 60 / 60 % 24) : parseInt(total  / 60 / 60 % 24);
      var minute = parseInt(total  / 60 % 60< 10 ?'0' + parseInt(total  / 60 % 60) : parseInt(total  / 60 % 60));
      var seconds = parseInt(total  % 60)< 10 ?'0'+ parseInt(total  % 60) : parseInt(total  % 60);
     // $('.nav_buy_time').html(hour + "小时" + minute + "分钟" + seconds + "秒");
      this.timer="活动倒计时 "+hour + ":" + minute + ":" + seconds;
      },
     },
     created(){
         var _this=this;
        _this.$nextTick(function(){    //等在mounted阶段把数据渲染完成后执行
        _this.scroll = new Bscroll(_this.$refs.wrapper, {click:true})     //初始化better-scroll
        //判断是否在活动期间
        _this.$http.get('http://zoomyoung.cn/api/design/is-in-active').then(function(res){  
            var total=parseInt(res.data.data.time_init);
            _this.$store.dispatch("setIsActive",res.data.data.is_action)
            if(res.data.data.is_action==1)
            {   
                _this.buyImg="http://file.zoomyoung.cn/web/img/btn_active.png"
                _this.timeFormate(total)
                setInterval(function () {
                total-=1;
                    _this.timeFormate(total)
                    }, 1000);
                _this.is_action=1;
            }else{
                _this.buyImg="http://file.zoomyoung.cn/web/img/btn_buy.png"
                _this.timer=""
            }   
          }).catch(function(err){  
          console.log(err)  
          }) 
      })
     }
  }
</script>

<style scoped>
    body,html{background: black}
   .wrapper{width: 100%;height: 100%}
   .dd{background:black;}
   .background{width: 100%;}
   .img_parent{width: 100%;font-size: 0}
   .background img{width: 100%;display: block;}
   .click_btn{width: 100%;height: 240px;position: fixed;bottom:0;left: 0;background-image: linear-gradient(-180deg, rgba(0,0,0,0.00) 0%, #000000 83%);z-index: 99}
   .nav_buy{width: 100%;height: 240px;}
   .nav_buy_zi{width: 100%;height:120px;display: block;margin-top: 50px}
   .nav_buy_zi img{width: 100%;z-index: 100}
   .nav_buy_time{width: 50%;height:50px;display: block;color: white;font-size: 32px;line-height: 50px;margin-left: 25%;text-align: center; }
</style>
